<!--  -->
<template>
  <div>
        <Card>
            <Form :model="formItem" :label-width="70">
                <Row :gutter="10" type="flex"  align="middle"  >
                <Col span="8">
                    <FormItem label="运维人员">
                        <Input v-model="formItem.name"  placeholder="姓名/手机号" clearable></Input>
                    </FormItem>
                </Col>
                <Col span="8">
                    <FormItem label="服务商"  v-if="user_type!='02'">
                        <Select v-model="formItem.serviceUuid" filterable>
                            <Option  v-for="item in moreServiceList" :value="item.uuid" :key="item.uuid">{{ item.name }}</Option>
                        </Select>
                    </FormItem>
                </Col>
                <!-- </Row>
                <Row :gutter="10" type="flex" justify="space-between" align="middle"  > -->

                <Col span="12"  >
                    <FormItem label="所在地">
                        <Cascader change-on-select v-model="search.location" placeholder="请选择省市区" :data="areasData" ></Cascader>
                    </FormItem>
                </Col>
                <Col span="12">
                    <FormItem label="注册时间">
                        <DatePicker v-model="search.timeRange" format="yyyy-MM-dd HH:mm" type="datetimerange" placement="bottom-end" placeholder="请选择开始和结束时间"></DatePicker>
                    </FormItem>
                </Col>
                </Row>
                <Row :gutter="10" >
                <Col span="8" offset="16"  style="text-align:right;">
                    <Button @click='searchGetTable' class="zh-hollow" type="primary" icon="ios-search-strong">搜索</Button>
                </Col>
                
                </Row>
            </Form>
        </Card>
    <Card style="margin-top:10px;" :padding="0">
      <Table :loading="loading" border :columns="columns" :data="data"></Table>
      <Page :current.sync="formItem.pageNumber"  :total="total" show-total show-sizer @on-change="pageChange" @on-page-size-change="pageSizeChange"></Page>
    </Card>
       
  </div>
</template>

<script>
import util from '@/libs/util.js'
import {getServiceAll} from '@/libs/system.js'
import {
    getAllServiceByCustomer,
    getDaiProTable
} from '@/libs/get.js'
import {examineProPeo} from '@/libs/post.js'
export default {
    name:'',
    data () {
        return {
            user_type:'',
            userUuid:'',
            btnp:{},
            btn:{
                dshywei_sh:false
            },
            loading:true,
            total:0,
            search:{
                location:[],
                timeRange:[]
            },
            formItem:{
                name:'',
                serviceUuid:'全部' ,
                pageNumber:1,
                pageSize:10  
            },
            moreServiceList:[], 
            areasData:this.$store.state.user.areaData ,              
            columns:[
                {
                    key:'name',
                    title:'姓名',
                    fixed:'left',
                    minWidth:100
                },
                {
                    key:'mobile',
                    title:'手机号',
                    align:'center',
                    minWidth:150
                },
                {
                    key:'area',
                    title:'所在地',
                    minWidth:200
                },
                {
                    key:'pname',
                    title:'所属服务商',
                    minWidth:200
                },
                {
                    key:'time',
                    title:'注册时间',
                    align:'center',
                    minWidth:150
                },
                {
                    key:'action',
                    title:'操作',
                    align:'center',
                    fixed:'right',
                    minWidth:150,
                    render:(h,params)=>{
                        return h('div',[
                            h('Button',{
                                props:{
                                type:'text',
                                size:'small'
                                },
                                style:{
                                color:'#2D8CF0',
                                display:this.btnp.dshywei_sh?'inline-block':'none'
                                },
                                on:{
                                click:()=>{
                                    let config={
                                    title:'审核人员',
                                    content:'是否通过该人员的注册申请？',
                                    okText:'通过',
                                    cancelText:'拒绝',
                                    closable:true,
                                    onOk:()=>{
                                        this.examine(params.row.uuid,'');
                                    },
                                    onCancel:()=>{
                                        this.examine(params.row.uuid,'jujue');
                                    }
                                    }
                                    this.$Modal.confirm(config)
                                    
                                }
                                }
                            },'审核')
                        ])
                    }
                }
            ]    ,
            data:[]  
        };
    },
    methods:{
        init(){
            let that=this;
            util.isCustomer(this);
            // setTimeout(()=>{
            //     that.areasData=that.$store.state.user.areaData;
            // },5000);
            
            this.getAllService();
        },
        async examine(uuid,decline){
            let res=await examineProPeo({uuid,decline});
            let response=res.data;
            if(response.code===200){
                if(!decline){
                    this.$Notice.success({
                        desc:'已通过。可前往“运维人员”为改人员关联服务客户。'
                    })
                }else{
                    this.$Notice.success({
                        desc:'已拒绝。'
                    })
                }
                this.formItem.pageNumber=1;
            this.getTable();
            }else{
                this.$Notice.error({
                    desc:response.msg
                });
            }
        },
        async getAllService(){
            let res;
            if(this.user_type=='00'){
                res=await getServiceAll();
            }else{
                res=await getAllServiceByCustomer(this.userUuid)
            }
            let response=res.data;
            if(response.code==200){
                this.moreServiceList=[{name:'全部',uuid:'全部'},...response.data];
            }else{
                this.$Notice.error({
                    desc:response.msg
                })
            }
        },
        searchGetTable(){
            this.formItem.pageNumber=1;
            this.getTable();
        },
        async getTable(){
            this.loading=true;
            let form=JSON.parse(JSON.stringify(this.formItem));
            for(let key in form){
                if(form[key]==='全部'){
                    form[key]='';
                }
            }
            if(!!this.search.timeRange[0]&&this.search.timeRange.length>0){
                form.startTime=util.time1(this.search.timeRange[0]);
                form.endTime=util.time1(this.search.timeRange[1]);
            }
            if(this.search.location.length>0&&!!this.search.location[0]){
                form.province=this.search.location[0];
                form.city=this.search.location[1];
                form.district=this.search.location[2];
            }     
            let res=await getDaiProTable(form);
            let response=res.data;
            if(response.code===200){
                this.total=response.data.total;
                this.data=response.data.rows.map(item=>{
                    item.time=item.created.slice(0,16);
                    return item
                })
                this.loading=false;
            }else{
                this.$Notice.error({
                desc:response.msg
                });
                
            }
        },
        pageSizeChange(size){
        //回到第一页
            this.formItem.pageNumber=1;
            this.formItem.pageSize=size;
            this.getTable();
        },
        pageChange(number){
            this.formItem.pageNumber=number;
            this.getTable();
        }
    },
    created(){
        this.btnp=util.bpower(this,this.btn);
        this.init();
        this.getTable();
    }

}

</script>
<style lang='scss' >
</style>